<!--
 * @Description:
 * @Author: dh
 * @Date: 2022-01-21 13:41:19
 * @LastEditors: dh
 * @LastEditTime: 2022-10-27 13:52:42
-->
<template>
	<div>
		{{ msg }} <br />
		我是emit子组件
		<button @click="emit">测试emit</button>
	</div>
</template>

<script lang="ts">
import { defineComponent } from 'vue';

export default defineComponent({
	props: {
		msg: {
			type: String,
		},
	},

	// 显示组件自定义事件有哪些，并且有验证作用
	emits: {
		// 验证，返回true 验证通过，反之不通过，但是都会执行， 只是不通过时会打印warning：
		onMyChange: (payload: any) => {
			return payload;
		},
		// 不验证，直接触发
		Submit: null,
	},

	// emits: ['onMyChange'], // 也可写成数组，全部不验证

	setup(props, context /* emit,attrs,slots */) {
		const emit = () => {
			context.emit('onMyChange', '我是emit子组件');
		};
		return {
			emit,
		};
	},
});
</script>
